<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,viewport-fit=cover">
    <title>我的订单</title>
    <link rel="stylesheet" type="text/css" href="../../js/vant/index.css" />
    <link rel="stylesheet" type="text/css" href="../../css/main.css" /> 
    <link rel="stylesheet" type="text/css" href="../../css/order/my_order.css" /> 
</head>

<body>
    <div id="order_id">
        <header class="header-main">
            <van-nav-bar title="我的订单"></van-nav-bar>
        </header>
        <div class="detail-info main-body">
            <div class="top-tab">
                <van-tabs v-model="activeTop" @click="tabBeforeChange">
                    <van-tab title="全部" :key="0"></van-tab>
                    <van-tab title="待核销" :key="1"></van-tab>
                    <van-tab title="已结束" :key="2"></van-tab>
                    <!-- <van-tab title="待评价"></van-tab> -->
                </van-tabs>
            </div>
            <div class="order-list-content">
                <template>
                <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
                    <van-list
                        v-model="loading"
                        :finished="finished"
                        finished-text="没有更多了"
                        @load="onLoad">
                        <div class="card-item" v-for="orderItem in orderList">
                            <div class="order-time">
                                <van-cell title-class="order-time-title" value-calss="order-time-value"  :title="orderItem.createTime" :value="showStatusName(orderItem)" ></van-cell>
                            </div>
                            <van-row>
                                <van-col span="6">
                                    <div class="goods-img">
                                        <van-image v-if="orderItem.actId==1" width="100%" height="100%" src="../../images/goodsDetail/goods_header.png" fit="cover">
                                            <template v-slot:loading>
                                            <van-loading type="spinner" size="20" />
                                            </template>
                                        </van-image>
                                        <van-image v-else-if="orderItem.actId==2" width="100%" height="100%" src="../../images/goodsDetail/goods_header.png" fit="cover">
                                            <template v-slot:loading>
                                                <van-loading type="spinner" size="20" />
                                            </template>
                                        </van-image>
                                        <van-image v-else-if="orderItem.actId==3" width="100%" height="100%" src="../../images/goodsDetail/zhutileyuan.png" fit="cover">
                                            <template v-slot:loading>
                                                <van-loading type="spinner" size="20" />
                                            </template>
                                        </van-image>
                                        <van-image v-else-if="orderItem.actId==4" width="100%" height="100%" src="../../images/goodsDetail/yuxue.png" fit="cover">
                                            <template v-slot:loading>
                                                <van-loading type="spinner" size="20" />
                                            </template>
                                        </van-image>
                                    </div>
                                </van-col>
                                <van-col span="18">
                                    <div>
                                        <van-row>
                                            <van-col span="13">
                                                <div v-if="orderItem.actId==1" class="goods-title">滴水山泉1份555ML*12瓶</div>
                                                <div v-else-if="orderItem.actId==2" class="goods-title">滴水山泉1份555ML*12瓶</div>
                                                <div v-else-if="orderItem.actId==3" class="goods-title">万达茂主题乐园110元购票</div>
                                                <div v-else-if="orderItem.actId==4" class="goods-title">万达茂娱雪乐园108元购票</div>
                                            </van-col>
                                            <van-col span="11">
                                                <div class="price-area">
                                                    <div class="price">
                                                        <van-cell v-if="orderItem.actId==1" title-class="price-title" value-class="price-value" title="原&emsp;价:" value="¥28.00"></van-cell>
                                                        <van-cell v-else-if="orderItem.actId==2" title-class="price-title" value-class="price-value" title="原&emsp;价:" value="¥28.00"></van-cell>
                                                        <van-cell v-else-if="orderItem.actId==3" title-class="price-title" value-class="price-value" title="原&emsp;价:" value="¥140.00"></van-cell>
                                                        <van-cell v-else-if="orderItem.actId==4" title-class="price-title" value-class="price-value" title="原&emsp;价:" value="¥138.00"></van-cell>
                                                    </div>
                                                    <div class="activity-price" style="white-space: nowrap;font-size: 0.7rem;">
                                                        <van-cell v-if="orderItem.actId==1" title-class="price-title" value-class="price-value" title="云闪付新用户价:" value="¥1.00"></van-cell>
                                                        <van-cell v-else-if="orderItem.actId==2" title-class="price-title" value-class="price-value" title="云闪付新用户价:" value="¥1.00"></van-cell>
                                                        <van-cell v-else-if="orderItem.actId==3" title-class="price-title" value-class="price-value" title="支持食安创城价:" value="¥110.00"></van-cell>
                                                        <van-cell v-else-if="orderItem.actId==4" title-class="price-title" value-class="price-value" title="支持食安创城价:" value="¥108.00"></van-cell>
                                                    </div>
                                                </div>
                                            </van-col>
                                        </van-row>
                                    </div>
                                    <div class="spe-item">
                                        <van-cell v-if="orderItem.actId==1" title-class="spe-title" value-calss="spe-value"  title="555ML*12" value="x1" ></van-cell>
                                        <van-cell v-else-if="orderItem.actId==2" title-class="spe-title" value-calss="spe-value"  title="555ML*12" value="x1" ></van-cell>
                                        <van-cell v-else-if="orderItem.actId==3" title-class="spe-title" value-calss="spe-value"  title="张" value="x1" ></van-cell>
                                        <van-cell v-else-if="orderItem.actId==4" title-class="spe-title" value-calss="spe-value"  title="张" value="x1" ></van-cell>
                                    </div>
                                </van-col>
                            </van-row>
                            <div class="distribution-type">
                                <van-cell title-class="distribution-title" value-class="distribution-value" title="配送方式:" value="自提"></van-cell>
                            </div>
                            <div class="distribution-type">
                                <van-cell v-if="orderItem.actId==1" title-class="distribution-title" value-class="distribution-value" title="活动优惠券:" value="¥27.00"></van-cell>
                                <van-cell v-else-if="orderItem.actId==2" title-class="distribution-title" value-class="distribution-value" title="活动优惠券:" value="¥27.00"></van-cell>
                                <van-cell v-else-if="orderItem.actId==3" title-class="distribution-title" value-class="distribution-value" title="活动优惠券:" value="¥30.00"></van-cell>
                                <van-cell v-else-if="orderItem.actId==4" title-class="distribution-title" value-class="distribution-value" title="活动优惠券:" value="¥30.00"></van-cell>
                            </div>
                            <div class="distribution-type">
                                <van-cell v-if="orderItem.actId==1" title-class="distribution-title" value-class="distribution-value" title="活动名称:" value="1元购水助创城"></van-cell>
                                <van-cell v-else-if="orderItem.actId==2" title-class="distribution-title" value-class="distribution-value" title="活动名称:" value="1元捐水助创城"></van-cell>
                                <van-cell v-else-if="orderItem.actId==3" title-class="distribution-title" value-class="distribution-value" title="活动名称:" value="万达茂主题乐园110元购票"></van-cell>
                                <van-cell v-else-if="orderItem.actId==4" title-class="distribution-title" value-class="distribution-value" title="活动名称:" value="万达茂娱雪乐园108元购票"></van-cell>
                            </div>
                            <div class="distribution-type">
                                <van-cell title-class="distribution-title" value-class="price-value" title="实付金额:" :value="'¥'+orderItem.amount"></van-cell>
                            </div>
                            <!-- <div class="distribution-type">
                                <van-cell title-class="distribution-title" value-class="distribution-value" title="商&ensp;户&ensp;号:" value=""></van-cell>
                            </div> -->
                            <div class="distribution-type">
                                <van-cell title-class="distribution-title" value-class="distribution-value" title="姓&emsp;&emsp;名:" :value="orderItem.customerName"></van-cell>
                            </div>
                            <div class="distribution-type">
                                <van-cell title-class="distribution-title" value-class="distribution-value" title="手机号码:" :value="orderItem.mobile"></van-cell>
                            </div>
                            <div class="distribution-type" v-if="orderItem.region">
                                <van-cell title-class="distribution-title" value-class="distribution-value" title="所属地区:" :value="orderItem.region"></van-cell>
                            </div>
                            <div class="distribution-type" v-if="orderItem.address">
                                <van-cell title-class="distribution-title" value-class="distribution-value" title="地&emsp;&emsp;址:" :value="orderItem.address"></van-cell>
                            </div>
                            <div class="distribution-type" v-if="orderItem.school">
                                <van-cell title-class="distribution-title" value-class="distribution-value" title="学&emsp;&emsp;校:" :value="orderItem.school"></van-cell>
                            </div>
                            <div class="distribution-type" v-if="orderItem.grade">
                                <van-cell title-class="distribution-title" value-class="distribution-value" title="年&emsp;&emsp;级:" :value="orderItem.grade"></van-cell>
                            </div>
                            <div class="distribution-type" v-if="orderItem.school">
                                <van-cell title-class="distribution-title" value-class="distribution-value" title="班级名称:" :value="orderItem.className"></van-cell>
                            </div>
                            <div class="distribution-type" style="white-space: nowrap">
                                <van-cell title-class="distribution-title" value-class="distribution-value" title="订单编号:" :value="orderItem.morderId"></van-cell>
                            </div>
                            <div class="preferential" v-if="orderItem.hxTime">
                                <van-cell title-class="preferential-title" value-class="distribution-value" title="核销时间:" :value="orderItem.hxTime"></van-cell>
                            </div>
                            <div class="gools-total">
                                <span class="gools-number">共1件&emsp;合计金额:</span><span class="gools-total-price">{{orderItem.amount}}元</span>
                            </div>
                        </div>
                    </van-list>
                </van-pull-refresh>
                </template>
            </div>
        </div>
        </template>
    </div>
</body>
<script type="text/javascript" src="../../js/jquery/jquery320min.js"></script> 
<script type="text/javascript" src="../../js/vant/vuemin.js"></script>
<script type="text/javascript" src="../../js/vant/vantmin.js"></script>
<script type="text/javascript" src="../../js/packajax.js"></script>
<script type="text/javascript" src="../../js/order/my_order.js"></script>
</html>